<!-- <template>
  <div class="loginEntry">
    <div>
      <img src="/static/img/title.png" alt="">
    </div>
    <div class="login">
      <div class="fbx">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
          <el-form-item label="" prop="username">
            <el-input v-model="ruleForm.username"><i slot="prefix" class="el-input__icon el-icon-user"></i></el-input>
          </el-form-item>
          <el-form-item label="" prop="password">
            <el-input v-model="ruleForm.password" show-password><i slot="prefix"
                class="el-input__icon el-icon-lock"></i></el-input>
          </el-form-item>
          <el-form-item label="">
            <el-checkbox @change="rmbu" v-model="checked">记住账号</el-checkbox>
          </el-form-item>
        </el-form>
        <el-button @click="submitForm('ruleForm')"
          style="width: 100%;background-color: #387BFF;color: #fff;">登录</el-button>
      </div>
    </div>
  </div>
</template>
<script>
import http from '../utils/http';
import api from '../utils/api';
export default {
  data() {
    return {
      checked: false,
      ruleForm: {
        username: '',
        password: ""
      },
      rules: {
        username: [
          { required: true, message: '请输入账号', trigger: 'blur' }
        ],
        password: [
          { required: true, message: '请输入密码', trigger: 'blur' }
        ],
      }
    }
  },
  created() {
    if (window.localStorage.getItem('user') != undefined) {
      this.ruleForm.username = window.localStorage.getItem('user');
    }
  },
  mounted() {
  },
  methods: {
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          http.post(api.login, {
            "username": this.ruleForm.username,
            "password": this.ruleForm.password,
            "captcha": ""
          }).then(res => {
            if (res.data.code == '200') {
              this.$router.push('/block');
              console.log();
              window.sessionStorage.setItem('token', res.data.data.token);
            }
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    rmbu() {
      if (this.checked && this.ruleForm.username != '') {
        window.localStorage.setItem('user', this.ruleForm.username);
      } else {
        window.localStorage.removeItem('user');
      }
    }
  }
}
</script>
<style scoped>
.loginEntry {
  width: 100%;
  height: 100%;
  background-image: url('../../static/img/bc.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.login {
  width: 5rem;
  height: 4rem;
  margin-top: 0.32rem;
  background-image: url('../../static/img/login.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  overflow: hidden;
}

.fbx {
  width: 4rem;
  margin: 1rem .5rem 0 .5rem;
}
</style>
 -->
